<!DOCTYPE html>
<html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
      <title>绑定手机</title>
      {include file="public/link" /}
      <style type="text/css">
        .layui-table-body{
            overflow: hidden;
        }
      </style>
  </head>
  <body>
  	<div style="width: 95%;margin: 15px auto;">
	    <form class="layui-form" action="">
		  <div class="layui-form-item">
		    <div class="layui-inline">
		      <label class="layui-form-label">手机号</label>
		      <div class="layui-input-inline">
		        <input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input" id="phone">
		      </div>
		    </div>
		    <div class="layui-inline">
		      <label class="layui-form-label">验证码</label>
		      <div class="layui-input-inline verify_v">
		        <input type="text" name="verify" lay-verify="required" lay-verify="email" autocomplete="off" class="layui-input" style="width: 80px;float: left;">
		        <div class="layui-btn layui-btn-normal" style="float: left;margin-left: 10px;" data-type="send">发送验证码</div>
		      </div>
		    </div>
		    <div class="layui-form-item" style="text-align: center;">
			    <button class="layui-btn" lay-submit="" lay-filter="bing">绑定手机号</button>
			</div>
		  </div>
	    </form>
	  </div>
	  <div class="">
	  
	  </div>


    <script src="{$Assets}layui/layui.js?t=1515376178709"></script>
<script>
layui.use(['form', 'layedit', 'laydate','layer','table'], function(){
  var form = layui.form
  ,layer = layui.layer
  ,table = layui.table
  ,layedit = layui.layedit
  ,laydate = layui.laydate;
  

 
  //自定义验证规则
  form.verify({
  });
  
  //监听提交
  form.on('submit(bing)', function(data){
    data=JSON.stringify(data.field);

    $.ajax({
        type:"POST",
        url: "{:url('login/checkverify')}",
        data:{data:data},
        dataType:"json",

        success:function(ret_datas){
            layer.msg(ret_datas);
            if(ret_datas=='绑定成功'){
            	setTimeout(function(){
            		window.location.href='/index.php/index/index/index';
        		},"1000");
            }
        }
    });
    return false;
  });
 
  var $ = layui.$, active = {
  		send:function(){
  			var phoneReg = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/;
  			var phone = $.trim($('#phone').val());
  			if (!phoneReg.test(phone)) {
  				alert('请输入有效的手机号码！');
				return false;
  			}else{
  					       $.ajax({
                        type:"POST",
                        url: "{:url('login/sendverify')}",
                        data:{data:phone},
                        dataType:"json",

                        success:function(ret_datas){
                        	layer.msg(ret_datas);
                        }
                    });
  			}      
  		}

  }
  
  $('.verify_v .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
  
});
</script>
  </body>
</html>